<!-- Created by henian.xu on 2018/11/27. -->

<template>
    <div :class="classes">
        <slot/>
    </div>
</template>

<script>
export default {
    name: 'Container',
    props: {
        fill: {
            type: Boolean,
            default: false,
        },
    },
    computed: {
        classes() {
            const { fill } = this;
            return ['container', { fill }];
        },
    },
};
</script>

<style lang="scss">
.container {
    width: $page-min-width;
    margin-left: auto;
    margin-right: auto;

    &.fill {
        width: 100%;
    }
}
</style>
